<template>
	<view class="main">
		<view :style="'padding-top:'+(demo.height+demo.top+10)+'px'">
			<head1 class="nav_top"
				:style="'height:' +  demo.height + 'px;' + 'padding-top:' + demo.top + 'px;padding-bottom:10px'"
				:nav="title">
			</head1>
		</view>
		<view class="addWordExp" :style="'padding-top:'+(demo.height+demo.top+10)+'px'">
			<view class="addWordExp_list">
				<view :class="formData.companyName==''?'activeTrue':'activeFalse'"><text>*</text>公司名称</view>
				<input type="text" value="" v-model="formData.companyName" placeholder="请输入公司名称"
					placeholder-style="color:#d4d6e1" />
			</view>
			<view class="addWordExp_list addWordExp_list_zhic">
				<view><text>*</text>职位名称</view>
				<input type="text" value="" v-model="formData.position" placeholder="请输入职位名称"
					placeholder-style="color:#d4d6e1" />
				<!-- <view class="addWordExp_list_pic">
					<picker @change="bindPickerChange" :value="index" :range="positionNameList" range-key="meaning">
						<view class="uni-input">{{positionNameList[index].meaning}}
						<image src="../../static/icon/youjiantou.png" mode=""></image>
						</view>
					</picker>
				</view> -->
				<text style="display: none;">{{formData.position}}</text>

			</view>
			<view class="addWordExp_list">
				<view class="addWordExp_list_time">
					<view class="dis_flex">
						<view><text>*</text>工作时间</view>
					</view>
					<view class="dis_flex addWordExp_list_data">
						<view>
							<picker mode="date" :value="startTime" :start="startDate" :end="endDate"
								@change="bindDateChangeStr">
								<view class="uni-input" v-if="formData.startTime==''">请选择</view>
								<view class="uni-input" v-if="formData.startTime!=''">{{formData.startTime}}</view>
							</picker>
						</view>
						<view style="width: 100rpx;">
							--
						</view>
						<view>
							<picker mode="date" :value="endTime" :start="startDate" :end="endDate"
								@change="bindDateChangeEnd">
								<view class="uni-input" v-if="formData.endTime=='' || formData.endTime==null">请选择</view>
								<view class="uni-input" v-if="formData.endTime!='' && formData.endTime!=null">
									{{formData.endTime}}
								</view>
							</picker>
						</view>
					</view>
				</view>
			</view>
			<view class="addWordExp_list">
				<view><text style="opacity: 0;">*</text>见证人</view>
				<input type="text" value="" v-model="formData.witness" placeholder="请输入见证人姓名"
					placeholder-style="color:#d4d6e1" />
			</view>
			<view class="addWordExp_list">
				<view><text style="opacity: 0;">*</text>联系方式</view>
				<input type="text" value="" v-model="formData.witnessTel" placeholder="请输入见证人联系方式"
					placeholder-style="color:#d4d6e1" />
			</view>
			<view class="addWordExp_list text_list">
				<view><text style="opacity: 0;">*</text>工作职责</view>
				<textarea value="" v-model="formData.duty" placeholder="例：在职期间主要工作内容"
					placeholder-style="color:#d4d6e1" />
			</view>
			<view class="addWordExp_list_btn" @click="addWork(formData)">
				保存
			</view>
			<view v-if="btnStatus!=false" class="addWordExp_list_btn del" @click="del(formData)">
				删除
			</view>
		</view>
	</view>
</template>
<script>
	import head1 from '../../common/head/head'
	export default {
		components: {
			head1
		},
		data() {
			const currentDate = this.getDate({
				format: true
			})
			return {
				title: '工作经历',
				demo: {
					top: '',
					height: ''
				},
				nowTime: currentDate,
				positionNameList: [],
				array: ['中国', '美国', '巴西', '日本'],
				startTime: currentDate,
				time: '12:01',
				endTime: currentDate,
				timeIndexStart: 0,
				timeIndexEnd: '',
				btnStatus: false,
				formData: {
					experienceId: '',
					companyName: '',
					position: '',
					startTime: '',
					endTime: '',
					witness: '',
					witnessTel: '',
					duty: ''
				},
				index: 0
			}
		},
		onLoad(option) {
			if (JSON.stringify(option) == '{}') {
				// 添加
				this.timeIndexEnd == 0
			} else {
				// 修改
				this.btnStatus = !this.btnStatus
				this.timeIndexEnd == 1
				this.formData = JSON.parse(decodeURIComponent(option.data))
			}

		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		created() {
			const demo = uni.getMenuButtonBoundingClientRect()
			this.demo.top = demo.top
			this.demo.height = demo.height
			this.positionName() //职位名称
		},
		methods: {
			bindPickerChange: function(e) {
				this.index = e.target.value
				this.formData.position = this.positionNameList[this.index].enumValue
			},
			// 职位名称
			positionName() {
				this.$myResquest.getDict({
					enumCode: 'job'
				}).then(res => {
					if (res.data.code == 200) {
						this.positionNameList = res.data.data.job
					}
				})
			},
			addWork(data) {
				let checkPhone = /^1[3-9]\d{9}$/;
				if (data.companyName == '' || data.companyName == null) {
					uni.showToast({
						title: '请填写公司名称!',
						icon: "none"
					})
				} else if (data.position == '' || data.position == null) {
					uni.showToast({
						title: '请填写职位名称!',
						icon: "none"
					})
				} else if (data.startTime == '' || data.startTime == null) {
					uni.showToast({
						title: '请选择开始工作时间!',
						icon: "none"
					})
				} else if (data.startTime != '') {
					if (this.compare(data.startTime, this.nowTime)) {
						uni.showToast({
							title: '工作开始时间不能写未来的时间!',
							icon: 'none'
						})
					} else {
						if (data.endTime != null) {
							if (this.compare(data.startTime, data.endTime)) {
								uni.showToast({
									title: '工作结束时间不能小于开始时间',
									icon: 'none'
								})
							} else if (data.witnessTel != '') {
								console.log('yanzhane ')
								if (checkPhone.test(this.formData.witnessTel) == false) {
									uni.showToast({
										title: '手机号码格式不正确',
										icon: 'none'
									})
									return;
								} else {
									this.$myResquest.setExperiencePut(data).then(res => {
										if (res.data.code == 200) {
											uni.showToast({
												title: "保存成功"
											})
											setTimeout(() => {
												// 获取页面栈
												let pages = getCurrentPages()
												// 获取上一页栈
												let prevPage = pages[pages.length - 2]
												prevPage.$vm.test()
												uni.navigateBack()
											}, 1000)
										}
									})
								}
							} else {
								// if (data.witnessTel == '' || data.witnessTel == null) {
								// 	uni.showToast({
								// 		title: "联系方式不能为空",
								// 		icon: 'none'
								// 	})
								// }else if (checkPhone.test(this.formData.witnessTel) == false) {
								// 	uni.showToast({
								// 		title: '手机号码格式不正确',
								// 		icon: 'none'
								// 	})
								// 	return;
								// }
								this.$myResquest.setExperiencePut(data).then(res => {
									if (res.data.code == 200) {
										uni.showToast({
											title: "保存成功"
										})
										setTimeout(() => {
											// 获取页面栈
											let pages = getCurrentPages()
											// 获取上一页栈
											let prevPage = pages[pages.length - 2]
											prevPage.$vm.test()
											uni.navigateBack()
										}, 1000)
									}
								})
							}
						} else {
							this.$myResquest.setExperiencePut(data).then(res => {
								if (res.data.code == 200) {
									uni.showToast({
										title: "保存成功"
									})
									setTimeout(() => {
										// 获取页面栈
										let pages = getCurrentPages()
										// 获取上一页栈
										let prevPage = pages[pages.length - 2]
										prevPage.$vm.test()
										uni.navigateBack()
									}, 1000)
								}
							})
						}
					}
				}

			},
			// 日期校验
			compare(date1, date2) {
				let dates1 = new Date(date1);
				let dates2 = new Date(date2);
				if (dates1 > dates2) {
					return true
				} else {
					return false
				}
			},
			del(data) {
				this.$myResquest.personRemove({
					msgId: data.experienceId,
					type: 'experience'
				}).then(res => {
					if (res.data.code == 200) {
						uni.showToast({
							title: "删除成功"
						})
						setTimeout(() => {
							// 获取页面栈
							let pages = getCurrentPages()
							// 获取上一页栈
							let prevPage = pages[pages.length - 2]
							prevPage.$vm.test()
							uni.navigateBack()
						}, 1000)

					} else {
						uni.showToast({
							title: '删除失败',
							icon: "none"
						})

					}
				})
			},
			bindDateChangeStr: function(e) {
				this.formData.startTime = e.target.value
				this.timeIndexStart = 1
			},
			bindDateChangeEnd: function(e) {
				this.formData.endTime = e.target.value
				this.timeIndexEnd = 1
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();

				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			}

		}
	}
</script>

<style lang="scss" scoped>
	.main {

		.addWordExp {
			position: absolute;
			top: 0;
			width: 100%;
			height: 100%;
			background: #f7f7f7;
			// padding: 20rpx 0 0 0;

			.addWordExp_list {
				height: 136rpx;
				margin: 11rpx auto;
				background: #ffffff;
				padding: 25rpx 60rpx;

				>view {
					font-size: 28rpx;
					font-weight: 500;
					color: #49b3af;
					line-height: 35rpx;
				}

				>input,
				>textarea {
					padding: 10rpx 0 10rpx 13rpx;
					box-sizing: content-box;
				}

				>textarea {
					height: 150rpx;
					width: 670rpx;
				}

				.addWordExp_list_time {
					.addWordExp_list_data {
						padding: 15rpx;
						box-sizing: border-box;

						>view {
							width: 30%;
							text-align: left;
							color: #c9caca;
						}
					}
				}
			}

			.text_list {
				height: 280rpx !important;
			}

			.addWordExp_list_btn {
				width: 600rpx;
				height: 88rpx;
				line-height: 88rpx;
				background: #5cd1ce;
				border-radius: 44rpx;
				font-size: 34rpx;
				font-family: PingFang SC, PingFang SC-Medium;
				font-weight: 500;
				text-align: center;
				color: #ffffff;
				margin: 10rpx auto;
			}

			.del {
				background: #999999;
			}
		}
	}
</style>
